<template>
  <div class='timer-range fss'>
    <div
      class='tag'
      v-for="(item) in kvs"
      :key='item.flag'
      :class="value===item.flag?'active':''"
      @click="change(item)"
    >{{item.text}}</div>
  </div>
</template>

<script>
export default {
  name: "timerRange",
  props: {
    value: {
      type: [Number, String],
      default: 0,
    },
    kvs: {
      type: Array,
      default: () => [
        {
          flag: 0,
          text: "7日量",
        },
        {
          flag: 1,
          text: "30日量",
        },
        {
          flag: 2,
          text: "近半年",
        },
      ],
    },
  },
  data: function () {
    return {};
  },
  methods: {
    change({ flag }) {
      this.$emit("input", flag);
    },
  },
};
</script>

<style>
</style>